<template>
  <!-- 清算账户自动拆借管理申请应答录入明细页面弹出框-->
  <el-dialog
    title="清算账户自动拆借管理申请应答录入明细"
    center
    :visible.sync="open"
    width="1024px"
    :close-on-click-modal="false"
    @close="closeFn"
  >
    <el-form ref="settingsForm" :model="formData" :rules="rules" label-width="135px">
      <el-card class="form-card txnInfo-card">
        <div slot="header" class="label-header-msg">
          <span>清算账户自动拆借管理申请录入信息</span>
        </div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="交易流水号：" prop="id">
              <el-input v-model="formData.id" placeholder="交易流水号" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="CPG日期：" prop="vdate">
              <el-date-picker
                disabled
                v-model="formData.vdate"
                type="date"
                value-format="yyyyMMdd"
                placeholder="选择日期"
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作日期：" prop="workDate">
              <el-date-picker
                disabled
                v-model="formData.workDate"
                type="date"
                value-format="yyyyMMdd"
                placeholder="选择日期"
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="报文标识号：" prop="oriPkgId">
              <el-input v-model="formData.oriPkgId" placeholder="报文标识号" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="拆借协议号：" prop="protoNum">
              <el-input v-model="formData.protoNum" placeholder="拆借协议号" disabled />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="拆入清算行行号：" prop="cStBrno">
              <el-input v-model="formData.cStBrno" placeholder="拆入清算行行号" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="拆出清算行行号：" prop="dStBrno">
              <el-input v-model="formData.dStBrno" placeholder="拆出清算行行号" disabled />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="自动拆借管理类型：" prop="cdMngType">
              <el-select v-model="formData.cdMngType" placeholder="请选择" style="width: 100%" disabled>
                <el-option
                  v-for="dict in dictMap.CD_MNG_TYPE"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="拆借金额下限币种：" prop="lowerCurcd">
              <el-input v-model="formData.lowerCurcd" placeholder="拆借金额下限币种" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="拆借金额下限：" prop="amtLowerLmt">
              <el-input v-model="formData.amtLowerLmt" placeholder="拆借金额下限" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="拆借金额上限币种：" prop="upperCurcd">
              <el-input v-model="formData.upperCurcd" placeholder="拆借金额上限币种" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="拆借金额上限：" prop="amtUpperLmt">
              <el-input v-model="formData.amtUpperLmt" placeholder="拆借金额上限" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" v-if="formData.cdMngType == 'PC02'">
          <el-col :span="12">
            <el-form-item label="恢复金额币种：" prop="curcd">
              <el-input v-model="formData.curcd" placeholder="恢复金额币种" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="恢复金额：" prop="amount">
              <el-input v-model="formData.amount" placeholder="恢复金额" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="接收时间：" prop="recTime">
              <el-date-picker
                disabled
                v-model="formData.recTime"
                type="datetime"
                value-format="yyyyMMddHHmmss"
                placeholder="选择时间"
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>

      <el-card class="form-card txnInfo-card">
        <div slot="header" class="label-header-msg">
          <span>清算账户自动拆借管理申请应答录入</span>
        </div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="发起参与机构号：" prop="directRecver">
              <el-input v-model="formData.directRecver" placeholder="发起参与机构号" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="接收参与机构号：" prop="directSender">
              <el-input v-model="formData.directSender" placeholder="接收参与机构号" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="接收参与机构名称：" prop="directSenderName">
              <el-input v-model="formData.directSenderName" placeholder="接收参与机构名称" disabled />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="业务回执状态：" prop="bizStatus">
              <el-select v-model="formData.bizStatus" placeholder="请选择" style="width: 100%" @change="switchStatus">
                <el-option
                  v-for="dict in dictMap.ACTNO_PROC_STATUS"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <div v-if="formData.bizStatus == 'PR09'">
          <el-row type="flex">
            <el-col :span="10">
              <el-form-item label="业务拒绝处理码：" prop="bizRejectCode">
                <el-input v-model="formData.bizRejectCode" placeholder="业务拒绝处理码" @blur="getbase('REJECTCODE')" />
              </el-form-item>
            </el-col>
            <el-col :span="9">
              <el-input v-model="formData.bizRejectCodeDesc" placeholder disabled />
            </el-col>
            <el-col :span="1"></el-col>
            <el-col :span="4">
              <el-button type="primary" plain icon="el-icon-search" @click="openBasedataDialog('REJECTCODE')">
                请选择
              </el-button>
            </el-col>
          </el-row>
          <el-row type="flex">
            <el-col :span="24">
              <el-form-item label="业务拒绝信息：" prop="bizRejectInfo">
                <el-input v-model="formData.bizRejectInfo" placeholder="业务拒绝信息" />
              </el-form-item>
            </el-col>
          </el-row>
        </div>
        <el-row>
          <el-col :span="24">
            <el-form-item label="附言：" prop="remarks">
              <el-input type="textarea" v-model="formData.remarks" placeholder="附言" maxlength="256" show-word-limit />
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm" :loading="isLoading">提交</el-button>
      <el-button type="warning" @click="reset">重置</el-button>
    </div>
    <base-data-dialog ref="basedataDialog" @confirm="confirmData"></base-data-dialog>
  </el-dialog>
</template>
<script>
import { save } from "@/api/cnaps/saps/clearAcctAutoMng//clear_respond_entry.js";
import BaseDataDialog from "@/views/components/BasedataDialog";
import { getBasedata } from "@/api/cnaps/common/basedata";
import { log } from "util";
export default {
  name: "EntryDetails",
  components: { BaseDataDialog },
  props: {
    dictMap: {
      type: Object,
      default: () => {
        return {};
      },
    },
    formData: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  data() {
    return {
      // 是否显示弹出层
      open: false,
      isLoading: false,
      rules: {
        bizStatus: [
          {
            required: true,
            message: "必填",
            trigger: "change",
          },
        ],
        bizRejectCode: [
          {
            required: true,
            message: "必填",
            trigger: "blur",
          },
        ],
      },
    };
  },
  mounted() {},
  methods: {
    // 表单重置
    reset() {
      this.resetForm("settingsForm");
      this.$set(this.formData, "bizRejectCodeDesc", "");
    },
    closeFn() {
      this.open = false;
      this.reset();
    },
    show() {
      this.open = true;
    },
    switchStatus(val) {
      console.log(val, "业务状态");
      if (val == "PR05") {
        this.$set(this.formData, "bizRejectCode", "");
        this.$set(this.formData, "bizRejectCodeDesc", "");
        this.$set(this.formData, "bizRejectInfo", "");
      }
    },
    // 选择业务拒绝处理码弹框方法
    openBasedataDialog(dataType = "") {
      this.$refs.basedataDialog.show(dataType);
    },
    confirmData(dataType, row) {
      console.log(row);
      this.$set(this.formData, "bizRejectCode", row.dataValue);
      this.$set(this.formData, "bizRejectCodeDesc", row.dataDesc);
    },
    getbase(dataType) {
      let dataValue = this.formData.bizRejectCode;
      if (dataValue) {
        getBasedata(dataType, dataValue)
          .then((res) => {
            if (res.code == "S" && res.result !== null) {
              this.$set(this.formData, "bizRejectCode", res.result.dataValue);
              this.$set(this.formData, "bizRejectCodeDesc", res.result.dataDesc);
            } else {
              this.msgSuccess("找不到对应的字典项");
              this.$set(this.formData, "bizRejectCodeDesc", null);
            }
          })
          .catch((err) => {
            this.$set(this.formData, "bizRejectCodeDesc", null);
          });
      }
    },
    submitForm() {
      this.$refs["settingsForm"].validate((valid) => {
        if (valid) {
          this.isLoading = true;
          save(this.formData)
            .then((res) => {
              this.msgSuccess("提交成功！");
              this.isLoading = false;
              this.open = false;
              this.$emit("editComplete", true);
            })
            .catch((err) => {
              this.isLoading = false;
            });
        }
      });
    },
  },
};
</script>
<style>
.label-header-msg {
  font-weight: bold;
}

.form-card {
  margin-bottom: 10px;
}
</style>
